import classnames from 'classnames'
import PropTypes from 'prop-types'

const ToolbarButton = ({
  children,
  onClick,
  type = 'default',
  disabled = false,
  title
}) => {

  const handleClick = () => {
    if (!disabled) {
      onClick && onClick()
    }
  }

  return <div
    className={classnames({
      'toolbar-btn': true,
      'primary': type === 'primary',
      'disabled': disabled
    })}
    onClick={handleClick}
    title={title}
  >{children}</div>
}

ToolbarButton.propTypes = {
  title: PropTypes.string,
  disabled: PropTypes.bool,
  type: PropTypes.oneOf(['primary', 'default']),
  onClick: PropTypes.func
}

export default ToolbarButton